<template>
  <section class="todoapp">
    <button @click="fa"></button>
    <Header @add="add" v-model="todolist" ref="val"></Header>
    <Main v-model="msg" @del="del" :list="todolist" @ischange="ischange" :type="type" @ischekall="ischekall"></Main>
    <Footer
      :list="todolist"
      @clear="clear"
      v-model="type"
      
    ></Footer>
    
  </section>
</template>

<script>
import { mapState,mapActions } from 'vuex'
import Header from './components/header'
import Footer from './components/footer'
import Main from './components/main'
export default {
  computed: {
    ...mapState('list',['todolist']),
  },
  mounted(){console.log(this.todolist);},
  components: { Header, Footer, Main },
  data() {
    return {
      
      type: 'type',
      msg: '123',
      value:''
    }
  },
  created() {
    
    this.getlist()
  },
  methods: {
   ...mapActions('list',['getlist']),
   
    fa() {
      
    },
    add() {
      
    },
    ischange() {
      
    },
    clear() {
      
    },
    
    del() {
     
    },
    ischekall() {
   
  }
  },
 
  // watch: {
  //   list: {
  //     deep: true,
      
  //     handler(val) {
  //       localStorage.setItem('key', JSON.stringify(val))
        
  //     }
  //   },
    
  // },
  
}
</script>

<style></style>
